
.px2rem(@name, @px){
    @{name}: @px / 75 * 1rem;
}
.fz(@px){
	.px2rem(font-size,@px);
}

.header{
	position: fixed;
	width: 100%;
	.px2rem(height,90);
	border-bottom: 1px solid #e2e2e2;
	background: #fff;
	display: flex;
	text-align: center;
	z-index: 99;
	.left{
		width: 15%;
		display: flex;
		align-items: center;
		justify-content: center;
		img{
			width: 50%;
		}
	}
	.center{
		width: 65%;
		.px2rem(padding-top,10);
		color: #ababab;
		span{
			display: block;
			.px2rem(height,70);
			border: 1px solid #e2e2e2;
			border-radius: 6px;
			.px2rem(line-height,70);
		}
	}
	.right{
		width: 20%;
		.px2rem(line-height,90);
		.icon{
			display: inline-block;
			overflow: hidden;
			width: 4px;
			height: 4px;
			margin-left: 10px;
			border: 1px solid #000;
			border-width: 1px 1px 0 0;
			transform: rotate(135deg);
		    transform-origin: 75% 25%;
		}
	}
}

.content{
	.px2rem(padding-top,90);
	background: #fff;
	display: flex;
	position: relative;
	.left{
		position: fixed;
		.px2rem(top,90);
		width: 25%;
		li{
			background: #f9f9f9;
			border-bottom: 1px solid #e2e2e2;
			box-sizing: border-box;
			.px2rem(height,83);
			.px2rem(line-height,83);
			.px2rem(padding-left,22);
		}
		.active_li{
			background: #fff;
			color: #18a7fd;
		}
	}
	.right{
		width: 70%;
		.px2rem(margin-bottom,120);
		margin-right: 2.5%;
		margin-left: 27.5%;
		.title{
			.px2rem(padding-left,20);
			.px2rem(padding-top,5);
			.px2rem(padding-bottom,5);
			.px2rem(margin-top,30);
			background: #f7f8fa;
		}
		.bottom{
			display: flex;
			text-align: center;
			flex-wrap: wrap;
			p{
				width: 30%;
				.px2rem(padding-top,20);
				.px2rem(padding-bottom,20);
				.px2rem(margin-top,20);
				margin-right: 5%;
				border: 1px solid #e2e2e2;
				border-radius: 5px;
				box-sizing: border-box;
				white-space: nowrap;
				overflow: hidden;
			}
			p:nth-child(3n){
				margin-right: 0;
			}
		}
	}
}